﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage_HomePage.master" AutoEventWireup="true" CodeFile="BookTicket_2.aspx.cs" Inherits="Clients_BookTicket_2" %>

 <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<script>
    var dem = 1;
    function generatenew() {
        dem = dem + 1;
        var d = document.getElementById("thongtinnguoidatcho");
        var value = document.getElementById('<%=txtseatused.ClientID%>').value;
        var iner = "<div id=chua" + dem + "></br><p>" + dem + ". FullName:</p> <input id='txtname" + dem + "' type='text'> <p> Choose seat:</p><select id='txtseat" + dem + "'> </select> <p> Age:</p> <select id='txtage" + dem + "'/>"
        d.innerHTML += iner;
        addselect(dem);
        addage(dem);
        removeitem(value, dem);
        
    }

    function addselect(dem) { 
   
    var myobject = {
        A1: 'A1', A2: 'A2',A3: 'A3',A4: 'A4',
        B1: 'B1',B2: 'B2',B3: 'B3',B4: 'B4',
        C1: 'C1',C2: 'C2',C3: 'C3',C4: 'C4',
        D1: 'D1',D2: 'D2',D3: 'D3',D4: 'D4',
        E1: 'E1',E2: 'E2',E3: 'E3',E4: 'E4',
        F1: 'F1',F2: 'F2',F3: 'F3',F4: 'F4',
        G1: 'G1',G2: 'G2',G3: 'G3',G4: 'G4',
        H1: 'H1',H2: 'H2',H3: 'H3',H4: 'H4',
        I1: 'I1',I2: 'I2',I3: 'I3',I4: 'I4',
        J1: 'J1',J2: 'J2',J3: 'J3',J4: 'J4',
        K1: 'K1',K2: 'K2',K3: 'K3',K4: 'K4',
        L1: 'L1',L2: 'L2',L3: 'L3',L4: 'L4',L5: 'L5'
	};

    var select = document.getElementById("txtseat" + dem);
	for(index in myobject) {
	    select.options[select.options.length] = new Option(myobject[index], index);
	}

}

function addage(dem) {

    var myobject = {
        5: 'duoi5', 512: '5toi12', 1250: '12toi50', 50: 'tren50'
    };

    var select = document.getElementById("txtage" + dem);
    for (index in myobject) {
        select.options[select.options.length] = new Option(myobject[index], index);
    }

}

function getallvalue() {
    var i = 1;
    var chua = "";
    while(i<=dem) {
        var getname = document.getElementById('txtname' + i).value;
        var getseat = document.getElementById('txtseat' + i).value;
        var getage = document.getElementById('txtage' + i).value;
        if (i != dem) {
            chua = chua + getname + "," + getseat + "," + getage + ";";
        }
        else {
            chua = chua + getname + "," + getseat + "," + getage;
        }
        
        document.getElementById('<%=txtallelement.ClientID%>').value = chua;

//        alert(escape(getname));
        i++;
    }
}


function removeitem(items,combobox) {
    var sel = $("select#txtseat"+combobox);
    var a = items.split(",") // Delimiter is a string
    for (var i = 0; i < a.length; i++) {
        sel.find("option[value='"+a[i]+"']").remove();
    }

}


function removeElement() {

    if (dem > 1) {
        var child = document.getElementById('chua' + dem);
        var parent = document.getElementById('thongtinnguoidatcho');
        parent.removeChild(child);
        dem = dem - 1;
    }
}

function alerterror(x) { 
    alert(x);
}
</script>


</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
		<form id="form1" runat="server">
		<div id="title">
             <p class="title">Detail Bus</p>
            <asp:HiddenField ID="txtseatused" runat="server" />                    
            <asp:HiddenField ID="txtallelement" runat="server" />
            <div id="hinhghexe">
            <img src="../Images/Ghe.png" alt="" />
            </div>
            <div id="thongtinnguoidatcho">
                <div id=chua1>
                <p>1. FullName:</p> <input id="txtname1" type="text">
            	    <p>Choose seat:</p><select id="txtseat1"></select>
                    <p>Age:</p> <select id='txtage1'></select>
				    <input type="button"  value="Book more" onclick="generatenew()">
                     <input type="button"  value="Remove Item" onclick="removeElement()">
                </div>
				
            </div>     
  
             <table width="960px">
    <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label3" runat="server" Text="FullName: "></asp:Label></td>
        <td><asp:TextBox ID="txtFullNameCustomer" runat="server" Width="177px"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFullName" runat="server" 
                ControlToValidate="txtFullNameCustomer" ErrorMessage="FullName Not null" 
                Display="Dynamic"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator7" runat="server" 
                ControlToValidate="txtFullNameCustomer" 
                ErrorMessage="Name can not have special character" 
                ValidationExpression="(^[a-zA-Z0-9 ]{1,})$"></asp:RegularExpressionValidator>
        </td>
    </tr>
     
     <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label10" runat="server" Text="Age: "></asp:Label></td>
        <td><asp:TextBox ID="txtAge" runat="server" Width="177px"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" 
                ControlToValidate="txtAge" ErrorMessage="Age Not null" Display="Dynamic"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" 
                ControlToValidate="txtAge" ErrorMessage="Please fill in your age" 
                ValidationExpression="^[1-9][0-9]?$"></asp:RegularExpressionValidator>
         </td>
    </tr>
    
    <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label1" runat="server" Text="Sex: "></asp:Label></td>
        <td style="margin-left: 80px">
            <asp:DropDownList ID="DropDownList1" runat="server">
                <asp:ListItem>Male</asp:ListItem>
                <asp:ListItem>FeMale</asp:ListItem>
            </asp:DropDownList>
        </td>
    </tr>
     
     <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label2" runat="server" Text="Address: "></asp:Label></td>
        <td><asp:TextBox ID="txtAddress" runat="server" Width="177px"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" 
                ControlToValidate="txtAddress" ErrorMessage="Address Not Null" 
                Display="Dynamic"></asp:RequiredFieldValidator>
         </td>
    </tr>
        <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label4" runat="server" Text="Phone: "></asp:Label></td>
        <td><asp:TextBox ID="txtPhone" runat="server" Width="177px"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" 
                ControlToValidate="txtPhone" ErrorMessage="Phone Not Null" 
                Display="Dynamic"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server" 
                ControlToValidate="txtPhone" ErrorMessage="Please fill in your phone" 
                ValidationExpression="0\d{9,10}"></asp:RegularExpressionValidator>
            </td>
    </tr>

    <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label5" runat="server" Text="Email: "></asp:Label></td>
        <td><asp:TextBox ID="txtEmail" runat="server" Width="177px"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" 
                ControlToValidate="txtEmail" ErrorMessage="Email Not Null" 
                Display="Dynamic"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server" 
                ControlToValidate="txtEmail" ErrorMessage="Please fill in the right email" 
                ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
        </td>
    </tr>

    <tr>
        <td align="right" width="150px" style="font-weight:bold"><asp:Label ID="Label11" runat="server" Text="Identity Card: "></asp:Label></td>
        <td><asp:TextBox ID="txtCMND" runat="server" Width="177px"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" 
                ControlToValidate="txtCMND" ErrorMessage="IdentityCard Not Null" 
                Display="Dynamic"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server" 
                ControlToValidate="txtCMND" 
                ErrorMessage="please fill in the right identity card" 
                ValidationExpression="[0-9]{9}"></asp:RegularExpressionValidator>
        </td>
    </tr>
</table>

           
            <asp:Button ID="btncontinute" runat="server" Text="Continute" 
                 OnClientClick="getallvalue()" CssClass="button" 
                 onclick="btncontinute_Click"/>
         
             </br>                                                           
        </div><!--End tag div title return getallvalue();-->    
            </form>
                    
</asp:Content>

